<style>
    .page{
        background-color: white;
    }
    .weui-cells:first-child {
        margin-top:0px
    }
    .page.article {
        background-color: #F1F1F1;
    }
    .weui-form-preview__bd{
        color: #0f0f0f;
    }
    .textTips-small{
        font-size: .24rem;
        color: #999999
    }
    .weui-btn_default{
        color: #FC6E47;
    }
    .weui-btn:after{
        border: 1px solid #FC6E47;
    }
    .weui-btn_mini{
        font-size: .24rem;
        padding: 0 1.3em;
    }
    .page_banner{
        background: linear-gradient(to right, rgba(254,121,84,0.8), rgba(254,121,84,1));;
    }
    .weui-cell{
        padding: 5px;
    }
    .item.weui-cells:before{
        border-top: none!important;
    }
    .item.weui-cells:after{
        border-bottom: none!important;
    }
    .text-normal{
        color: #999999;font-size: .3rem
    }
    .weui-btn_orangeBottom{
        background: linear-gradient(to right, rgba(254,121,84,0.8), rgba(254,121,84,1));
    }
</style>
<div class="page article js_show" ng-controller="ReserveOrdersCtrl">
    <div class="orderList" ng-show="!data.isShowDetail">
        <div class="weui-navbar">
            <div class="weui-navbar__item " ng-repeat="item in data.tabs" ng-click="event.btnChooseTab_click(item)" ng-class="{'weui-bar__item_on':data.currTab == item.value}">
                {{item.name}}
            </div>

        </div>
        <div class="weui-tab__panel" style="background-color: white">
            <div class="order wrapper b-b"  ng-repeat="orderItem in data.ordersList" ng-show="data.currTab == '2' ||data.currTab == '1'">
                <div class="weui-flex ">
                    <div class="weui-flex__item" style="color: #333333; font-weight: bold;font-size: .4rem">{{orderItem.ShopName}}</div>
                    <div class="weui-flex__item text-right m-t-xs textTips-small" style="">
                        <span ng-bind="orderItem.payTypeText" ng-style="{'display':lblBotStatusView_Css}">订单已预定</span></span>
                    </div>
                </div>
                <div class="weui-flex textTips-small m-t-xs">
                    <span>{{'共'+orderItem.BillItemCount+'件商品'}}</span>
                </div>
                <div class="weui-flex m-t-sm">
                    <p style="color: #333333;font-size: .32rem">预定达到时间:<span>{{orderItem.CustomerMealTime}}</span></p>
                </div>
                <div class="weui-flex ">
                    <div class="weui-flex__item" style="color: #FF6A6A; font-weight: bold;font-size: .4rem">￥<span>{{orderItem.OrderDcTotal}}</span></div>
                    <div class="weui-flex__item text-right m-t-x" style="" ng-click="event.orderDetail_click(orderItem)">
                        <a class="weui-btn weui-btn_mini weui-btn_default" >查看订单</a>
                    </div>
                </div>
            </div>
            <div class="text-center m-t-xl" ng-show="data.ordersList.length == 0 && data.currTab != '3' && data.currTab != '4'">空空如也哦</div>
            <div class="text-center m-t-xl" ng-show="data.currTab == '3' ||data.currTab == '4'">空空如也哦</div>
        </div>

    </div>
    <div class="orderDetail"  ng-show="data.isShowDetail" >
        <div class="page_banner wrapper">
            <p class="m-t-sm" style="color: #ffffff;font-size: .5rem;font-weight: 500;letter-spacing: 2px">{{data.currOrder.lblTopStatusView}}</p>
            <p class="m-t-sm m-b-sm" style="font-size: .3rem;letter-spacing: 1.5px">预定时间:<span>{{data.currOrder.CustomerMealTime}}</span></p>
        </div>
        <div class="page-center wrapper" style="background-color: white">
            <p style="color: #333333; font-weight: bold;font-size: .46rem" class="m-b-sm">{{data.currOrder.ShopName}}</p>
            <div class="weui-cells m-t-none" ng-repeat="item in data.orderDetails.BillItems">
                <div class="weui-cell">
                    <div class="weui-cell__bd">
                        <p>
                            <span ng-bind="item.ItemName"></span>
                        </p>
                    </div>
                    <div class="weui-cell__ft">
                        <span> {{'￥' + item.ItemPrice}}</span>
                        <span data-bind="text: ' x ' + ItemCount">{{' x ' + item.ItemCount}}</span>
                    </div>
                </div>
                <div class="weui-cell" ng-show="item.IsSetMeal">
                    <div class="weui-cell__bd" style="overflow: hidden;">
                        <div class="item weui-cells " style="margin-top: -1px; margin-bottom: -1px" ng-repeat="itemSetMeal in item.SetMealItems">
                            <div class="weui-cell" style="font-size: 13px; color: #999999; ">
                                <div class="weui-cell__bd">
                                    <span>{{itemSetMeal.ItemName}}</span>
                                </div>
                                <div class="weui-cell__ft">
                                    x <span>{{itemSetMeal.ItemCount}}</span>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
            <!--<div class="m-t-sm m-b-sm" style="border-bottom: 1px solid #e5e5e5"></div>-->
            <div class="weui-flex" style="margin-top: 15px">
                <div class="weui-flex__item text-normal" >订单状态:</div>
                <div class="weui-flex__item text-right m-t-xs" style="">
                    <span >{{data.currOrder.lblTopStatusView}}</span>
                </div>
            </div>
            <div class="weui-flex">
                <div class="weui-flex__item text-normal" >下单日期:</div>
                <div class="weui-flex__item text-right m-t-xs" style="">
                    <span >{{data.currOrder.BillDateTime}}</span>
                </div>
            </div>
            <div class="weui-flex">
                <div class="weui-flex__item text-normal" >订单编号:</div>
                <div class="weui-flex__item text-right m-t-xs" style="">
                    <span >{{data.currOrder.BillNo}}</span>
                </div>
            </div>
            <div class="weui-flex" ng-show="data.currOrder.TeaCharge != 0">
                <div class="weui-flex__item text-normal">茶位费:</div>
                <div class="weui-flex__item text-right m-t-xs" style="">
                    <span>{{data.currOrder.TeaCharge}}</span>
                </div>
            </div>
            <div class="weui-flex">
                <div class="weui-flex__item text-normal">备注:</div>
                <div class="weui-flex__item text-right m-t-xs" style="">
                    <span>{{data.currOrder.CustomerRemark}}</span>
                </div>
            </div>
            <div class="weui-flex">
                <div class="weui-flex__item text-normal" >支付方式:</div>
                <div class="weui-flex__item text-right m-t-xs" style="">
                    <span >{{data.currOrder.payTypeText}}</span>
                </div>
            </div>
            <div class="weui-flex m-t-sm">
                <div class="weui-flex__item text-right" style="">
                    <span style="color: #999999">合计:<span style="color: #FF6A6A;font-size: .4rem">{{'￥'+data.currOrder.OrderDcTotal}}</span></span>
                </div>
            </div>

        </div>
        <div class="wrapper" style="background-color: white">
            <a  class="weui-btn weui-btn_orangeBottom m-t-none no-radius" ng-show="data.currOrder.btnUpdBill_Css" ng-click="event.editOrder_click()">修改订单</a>
            <a  class="weui-btn weui-btn_orangeBottom m-t-sm no-radius" ng-show="data.currOrder.btnPayBill_Css"  ng-click="event.payOrder_click()">支付订单</a>
            <a  class="weui-btn weui-btn_default no-radius m-t-sm" ng-click="data.isShowDetail = false">返回订单列表</a>
        </div>
    </div>


</div>
